// variable
// 参照bootstrap的定义规范遵循“$component-state-property-size”公式命名。
// 例:$nav-link-disable-color和$modal-content-box-shadow-xs

//
// Color system
//

$white:    #fff !default;
$gray-3: #333333 !default;
$gray-6: #666666 !default;
$gray-9: #999999 !default;
$black:    #000 !default;


$blue:    #3399ff !default;
$dark-blue: #1d89f6 !default;
$light-blue: #6eb5fc !default;
$orange:  #ff6633 !default;
$yellow:  #ffcc33 !default;
$light-yellow: #fff3d1 !default;

$list-wingblock-padding: 32px !default;
$list-border: 1px solid #eeeeee !default;

/*$green:   #28a745 !default-page;
$teal:    #20c997 !default-page;
$cyan:    #17a2b8 !default-page;
$indigo:  #6610f2 !default-page;
$purple:  #6f42c1 !default-page;
$pink:    #e83e8c !default-page;
$red:     #dc3545 !default-page;*/

// 应用场景
$body-color: #f9f9f9;



// Fonts
//
// Font, line-height, and color for body text, headings, and more.

// stylelint-disable value-keyword-case
$font-family-sans-serif:      PingFang-SC-Bold, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
$font-family-monospace:       SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
$font-family-base:            PingFang-SC-Bold;
// stylelint-enable value-keyword-case

$font-size-base:              28px !default;
$font-size-lg:                32px !default;
$font-size-xl:                36px !default;
$font-size-sm:                24px !default;
$h1-font-size:                $font-size-xl;
$h2-font-size:                $font-size-lg;
$h3-font-size:                30px !default;

$font-weight-light:           300 !default;
$font-weight-normal:          400 !default;
$font-weight-bold:            700 !default;

// 层级
$z-index: (
    modal              : 200,
    navigation         : 100,
    footer             : 90,
    header             : 90,
    triangle           : 60,
    navigation-rainbow : 50,
    share-type         : 41,
    share              : 40,
);
@function z-index($key) {
    @return map-get($z-index, $key);
}
@mixin z-index($key) {
    z-index: z-index($key);
}

// _config.scss
$breakpoints: (
    small: 767px,
    medium: 992px,
    large: 1200px
);

// _mixins.scss
@mixin respond-to($breakpoint) {
    @if map-has-key($breakpoints, $breakpoint) {
        @media (min-width: #{map-get($breakpoints, $breakpoint)}) {
            @content;
        }
    }

    @else {
        @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. "
        + "Please make sure it is defined in `$breakpoints` map.";
    }
}

// 图片路径
$imgUrl: "https://img.zzha.vip/" ;  // 测试图片地址
// $imgUrl: "https://pic.zzha.vip/" ;    // 生产图片地址

//雪碧图背景
@mixin spriteBg($num,$num1){
    background: url("#{$imgUrl}cam/assets/img/sprites/sprites.png?1");
    background-position:$num $num1;
    background-size: 1900px;
}

@mixin defaultBg($num,$num1){
    background: url("#{$imgUrl}cam/assets/img/sprites/missing.png") $num $num1;
    background-size: 1600px;
}

//多行注释
//@include TextareaOverflow(多少行)    使用方法
@mixin TextareaOverflow($num){
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: $num;
    -webkit-box-orient: vertical;
}

////示例
//.icon-ceshi:before{
//    content: "\e683";
//}
//
